html,body {
  overflow-x: hidden;
}

.navbar-brand img {
    max-height: 30px;
}
.nav-link {
    font-size: 0.9em;
}
.navgold {
  /* color:#664d1e; */
  background: #dabf76;
  /* background: -webkit-linear-gradient(top, #8f6B29, #FDE08D, #DF9F28);
background: linear-gradient(top, #8f6B29, #FDE08D, #DF9F28);*/
border:#8f6B29 1px solid; 
border-radius:18px;
}
.navgold a.nav-link {
  color: #242322 !important;
}

/* ------ Search Navbar ------- */
#btn-search-mobile  {
  margin-left:70px;
 }
  input {
  border-style: none;
  background: transparent;
  outline: none;
}
.buttons {
  padding: 0;
  background: none;
  border: none;
  outline: none;
}

.webflow-style-input {
  position: relative;
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 800px !important;
  margin: 0 auto;
  border-radius: 2px;
  padding: 1.4rem 2rem 1.6rem;
  /* background: $input-background; */
  /* &:after {
    content: "";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 999;
    height: 2px;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    background-position: 0% 0%;
    background: linear-gradient(
      to right,
      #b294ff,
      #57e6e6,
      #feffb8,
      #57e6e6,
      #b294ff,
      #57e6e6
    );
    background-size: 500% auto;
    animation: gradient 3s linear infinite;
  } */
}

.webflow-style-input input {
  flex-grow: 1;
  min-width:500px;
  /* color: $input-text-active; */
  font-size: 1.8rem;
  line-height: 2.4rem;
  vertical-align: middle;
  /* &::-webkit-input-placeholder {
    color: $input-text-inactive;
  } */
}

.webflow-style-input button {
  /* color: $input-text-inactive; */
  font-size: 2.4rem;
  line-height: 2.4rem;
  vertical-align: middle;
  transition: color 0.25s;
  /* &:hover {
    color: $input-text-active;
  } */
}

/* ------ ./ Search Navbar ------- */

.smalldescription {
  font-size:0.85em;
  color:#666;
  text-align: center;
  font-weight:400;
}

@media (max-width: 768px) {
.navbar-collapse {
    position: fixed;
    top: 54px;
    left: 0;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    height: 100%;
    background-color: black;
}

.navbar-collapse.collapsing {
    height: 100%;
    left: -75%;
    transition: height 0s ease;
}

.navbar-collapse.show {
    height: 100%;
    left: 0;
    transition: left 400ms ease-in-out;
    width: 70%;
}

.navbar-toggler.collapsed ~ .navbar-collapse {
    transition: left 400ms ease-in;
}
.navbar-nav {
    margin-top: 30px;
    padding: 20px;
}
#rowhero {
    margin-top:55px !important;
}
}

.tour-popup,
.tour-popup .tip-container .tip {
    background-color: #fff;
    /* box-shadow: 0 0 6px rgb(0 0 0 / 10%), 0 3px 5px rgb(22 24 26 / 25%); */
}

.tour-popup .info {
    width: 100%;
    margin: 20px 0 0;
    text-align: center;
}

.info h3 {
    font-size: 18px;
}

.location {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 130%;
    /* identical to box height, or 16px */
    /* Netral/600 */
    color: #757575;
    margin-top: 10px;
}

.tour-popup .map-avatar-container {
    position: absolute;
    top: -20px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    bottom: -18px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.tour-popup .map-avatar-container .avatar-image {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: solid 2px #fff;
}

.tour-popup .map-avatar-container * {
    pointer-events: none;
}

.tour-popup .map-avatar-container .avatar-shadow-container {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 2px;
    left: 2px;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgb(22 24 26 / 20%), inset 0 2px 3px rgb(22 24 26 / 40%);
}

.tour-popup .map-avatar-container .user-tooltip {
    width: 240px;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    bottom: 46px;
    height: 49px;
    pointer-events: none;
    cursor: pointer;
    border-radius: 3px;
    background: #fff;
    opacity: 0;
    -webkit-transition: opacity .1s linear;
    transition: opacity .1s linear;
}

.tour-popup .map-avatar-container .user-tooltip .user-name {
    font-size: 14px;
    line-height: 49px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #000;
    text-decoration: none;
    white-space: nowrap;
    text-align: center;
    padding: 0 10px;
}

.tour-popup .map-avatar-container * {
    pointer-events: none;
}

.tour-popup .map-avatar-container .user-tooltip:after {
    left: 50%;
    top: 100%;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    border: 7px solid rgba(255, 255, 255, 0);
    border-top-color: #fff;
    margin-left: -7px;
}

.tour-popup .tour-preview {
    margin: 0;
    position: relative;
    cursor: pointer;
    display: block;
}

.rm-infobox-img {
    display: block;
    height: 140px;
    width: 280px;
    position: relative;
}

.tour-popup .tour-preview {
    margin: 0;
    position: relative;
    cursor: pointer;
    display: block;
}

.tour-popup .tour-preview .infobox-overlay {
    height: 140px;
    width: 280px;
    left: 0;
    top: 0;
    background: #000;
}

.tour-popup .tour-preview .infobox-overlay,
.tour-popup .tour-preview:after {
    -webkit-transition: opacity .1s linear;
    transition: opacity .1s linear;
    position: absolute;
    cursor: pointer;
    display: block;
    opacity: 0;
}

.tour-popup .tour-preview:after {
    background: url(../images/main/video-button.svg) no-repeat;
    background-position: center;
    content: '';
    margin-top: -28px;
    margin-left: -28px;
    width: 56px;
    height: 56px;
    top: 50%;
    left: 50%;
}
.jarallax {
  position: relative;
  z-index: 0;
}
.jarallax > .jarallax-img {
  position: absolute;
  object-fit: cover;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.homecitybusiness {
  font-size:0.8em;
      }
.col-about-footer {
  padding-right:4em;color:#fff;font-size:0.8em; text-align:justify;margin-bottom:50px;
}
.col-about-footer a {
  color:rgb(194, 15, 15);
}
.iframe-360 {
  height:80vh;
}
.slogan{
text-align: center;
margin-top:50px;
/* margin-bottom: 100px; */
font-weight: 700;
/* font-family: 'Poppins', Helvetica, Arial, sans-serif; */
}
.businesspremium{
  text-align: center;
  margin-top:50px;
  margin-bottom:20px;
  /* margin-bottom: 100px; */
  font-weight: 700;
  /* font-family: 'Poppins', Helvetica, Arial, sans-serif; */
  }
  .businesspremium h1 {
    font-size:2.2em;
    font-weight: 500;
  }
.heading {
font-size: 1.7em;
color: rgb(7, 36, 51);
text-align: center;
font-weight: 700;
/* font-family: 'Poppins', Helvetica, Arial, sans-serif; */
margin-top: 80px;
}

.headingpage {
  font-size: 1.7em;
  color: rgb(7, 36, 51);
  text-align: center;
  font-weight: 700;
  /* font-family: 'Poppins', Helvetica, Arial, sans-serif; */
  margin-top: 100px;
  }

/**** SHOUT *****/
#shout {

/* background-color: #f0f2f3; */
padding: 0px;

}
.square {
width: 100%;
padding-bottom: 100%;
background-size: cover;
background-position: center;
border-radius:0.5rem;
}
.cardshout {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 8px solid #fff;
border-radius:0.5rem;
margin-bottom:20px;
overflow: hidden;

}
.cardshout {
transition: transform .5s ease;
}
.cardshout:hover {
transform: scale(1.05);
}
.overlay-shout {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
padding: 1rem;
border-radius:0.5rem;
background:rgba(0,0,0,0.5);
color :#fff;
}
.card-img-overlay {
background-color: rgba(0,0,0, 0.6) !important;
border-radius:0.5rem;
}
.overlay-text {
line-height: 18px;
position: relative;
bottom: 0px;
padding-bottom:8px;
top:60%;
text-align:center;
}
.row-content {
margin: 3em;
border-bottom: 2px #ccc;
}
/** Video slider **/
#videoslider {
    background-color: rgb(240, 240, 240);
}
/** SLICK **/


#sliderVideo_360>.slick-list>.slick-track>.slick-slide {
margin: 0px 0px;
}

.sliderVideo_360_arrow.slick-arrow#sliderVideo_360_prev {
top:0%;
left: 5%;
}

.sliderVideo_360_arrow.slick-arrow#sliderVideo_360_next {
top:0%;
left: 95%;
} 

.sliderVideo_360_arrow#sliderVideo_360_prev,
#sliderVideo_360_next {

width: 32px;
height: 32px;
background-color: black !important;
border-radius: 20px;
display: flex;
justify-content: center;
align-items: center;
}

.sliderVideo_360_arrow.slick-arrow {
filter: unset !important;
background: unset !important;
top: calc(50% + 16px);
position: absolute !important;
  top: 50%;
  z-index: 99;
}
#sliderVideo_360>.slick-list>.slick-track>.slick-slide:not(.slick-current):not(.slick-active):not(.slick-center) {
opacity: .4;
}

#sliderVideo_360 .slick-slide {
height: auto;
}

.slick-arrow {
color: #fff;
text-indent: unset !important;
}
.slick-slide {

max-width: 860px !important;
}
.slick-slide img {

width: 100% !important;
}
/* 
@media (max-width: 512px) {
.slick-slides {
   width: 375px !important;
   height:auto;
 }
} */

/**** CARD HOME ******/
.cardhome {
    transition: transform .5s ease;
    box-shadow: 0px 7px 15px 3px rgba(0,0,0,0.15);
-webkit-box-shadow: -1px 7px 15px 3px rgba(0,0,0,0.15);
-moz-box-shadow: -1px 7px 15px 3px rgba(0,0,0,0.15);
/* margin-bottom:20px; */
}
.cardhome:hover {
    transform: scale(1.05);
}
.cardsupporter {
  background: rgb(73, 72, 72);
  padding:40px 15px;
  min-height:182px;
}
.cardsupporter img {
  max-height:100px;
}
.card-quality {
    position: absolute;
    top:10px;
    left: 10px;
    padding:2px 5px;
    background: #FF4A52;
    color: #fff;
    font-size: 0.7em;
}
.card-quality-premium {
  position: absolute;
  top:3px;
  right: 3px;
 
  color: #fff;
  font-size: 0.7em;
}
.premium-quality {
  position: absolute;
  top:10px;
  left: 10px;
  padding: 2px 5px;
  background: #FF4A52;
  color: #fff;
  font-size: 0.7em;
  z-index: 9999;
}
.card-title {
    font-size: 0.875em;
    min-height: 2.2em;
    font-weight: 700;
    color: #333;
    text-align: center;
}
.card-title-province {
  font-size: 0.875em;
  min-height: 2.2em;
  font-weight: 900;
  color: #333;
  text-align: center;
}
.card-text {
    font-size: 0.9em;
    color: #ccc;
    height: 2em;
    text-align: center;
}
.card-footer {
    max-height: 50px;
    color: #999;
    vertical-align: middle;
    text-align: center;
}
.rowbanner {
    margin: 50px 0px;
}
.col-description {
  margin-top: 30px;
  margin-bottom: 50px;
}
.rowpersembahan {
    margin:50px 0px 0px 0px;
}
.rowfooter {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
    background-color: #111;
    padding: 3rem;
}
.rowfooter h3 {
    color: #fff;
    margin-bottom: 40px;
    font-weight: bold;
}
.col-links a {
    color: #fff;
}
.col-logo {
    margin-bottom: 30px;
}
.col-socmed img {
    max-width:38px;
    margin-right: 15px;
}
.col-socmed a {
  text-decoration:none;
}
.col-socmed h4 {
    margin:40px 0px 20px;
    color: #fff;
    font-size: 1.5em;
}
.rowdisclaimer {
    background-color: #000;
    color:#fff;
    padding: 30px 40px;
    font-size: 0.85em;
}
.rowdisclaimer a {
    color: #fff;
    text-decoration: none;
}
       
/* Icon 1 */

#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
    width: 25px;
    height: 30px;
    position: relative;
    /* margin: 10px auto; */
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
    border:none;
  }
  
  #nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #fff;
    border-radius: 3px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
  }
  
  #nav-icon1 span:nth-child(1) {
    top: 0px;
  }
  
  #nav-icon1 span:nth-child(2) {
    top: 10px; /* 13 */
  }
  
  #nav-icon1 span:nth-child(3) {
    top: 20px; /* 26 */
  }
  
  #nav-icon1.open span:nth-child(1) {
    top: 13px;
    -webkit-transform: rotate(133deg);
    -moz-transform: rotate(133deg);
    -o-transform: rotate(133deg);
    transform: rotate(133deg);
  }
  
  #nav-icon1.open span:nth-child(2) {
    opacity: 0;
    left: -60px;
  }
  
  #nav-icon1.open span:nth-child(3) {
    top: 14px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }
  .text-by {
      --bs-text-opacity: 1;
      color: #a9a9a9 !important;
      font-size: 0.65em;
      /* max-width: 70px; */
      display: inline-block;
  }
  .text-by a {
      color:#a9a9a9;
      text-decoration: none;
  }
  .divimagebusiness{
      padding:3px;
      border: 2px solid rgb(194, 59, 59); 
      border-radius:50%;
      transition: transform .5s ease;
      background:  transparent;
      /* max-width: 150px; */
  }
  .col-explore  {
   
    font-size:0.9em;
  }
  .col-explore a {
    color: #333;
    text-decoration: none;
    font-size:0.9em;
  }
  .divmap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    /* Ratio 16:9 ( 100%/16*9 = 56.25% ) */
}

.divmap>* {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}
    .divimagebusiness:hover {
     transform: scale(1.05);
    }
  .businessround {
      border-radius:50%;
      cursor: pointer;
       /* max-width: 150px;  */
  }
  .rowbusinessthumb {
      padding:0.5em 2em;
  }
  .divhomebusinesstext{
     margin-top:15px;
      font-size: 1em;
      line-height: 1.1em;
  }
  .divhomebusinesstextcategory{
    font-size: .8em;
    line-height: 1em;
    color: rgb(124, 0, 0);
}
  .slogan {
      margin:60px;
  }
  .col-hero-inside-wrapper{
    /* background: rgba(0, 0, 0, .5);   */
    position: absolute;
   
    color:#fff; 
    padding:1em;

    /* border-radius:40px; */
    /* position: relative; */
    /* margin-top:35%;
    margin-left:2%; */
    /* align-items: center;
  justify-content: center; */
  top: 50% ;
  left: 50% ;
  transform: translate(-50% , -50% );
  display: inline-flex;
  }

  .staycation{ 
    
    position: absolute; 
   
    color:#fff; 
    padding:1em;
     align-items: center;
  justify-content: center;
  top: 50% ;
  left: 50% ; 
  transform: translate(-50% , -50% ); 
   }
  
  .img-play {
    transition: transform .5s ease;
    max-width: 120px;
    margin-bottom:20px;
    }
  .img-play:hover {
    transform: scale(1.05);
  }
  .div-info-wrapper {
    position:fixed; 
    display: none;
    width:800px;
    top:0px;
    right:0px;
    background:#fff;
    z-index:9999;
    height:100vh;
    padding: 15px;
    overflow: scroll;
  }
  .divimagecover{
    min-height:640px;
  }
   .colcard-2-col-mobile {
    margin-bottom:40px;
  } 
  .suported-by {
       
   position:absolute;
   bottom: 0% ;
   right: 30% ;
   left: 30% ;
   /* transform: translate(-83% , -18% ); */
  
   margin:25px 0px; 
   color:rgb(16, 51, 95);
   background: rgba(0, 0, 0, .5); 
   color:#fff; 
   text-align: center;
  }
  .img-supporter {
    max-height:80px;
  }
.div-description {
  margin-bottom:1em;
}

.col-logo-supporter {
  width:300px;
  height:300px;
  background: rgb(73, 72, 72);
  border-radius:50%;
  text-align:center;

}
.logosupporter 
{
  max-width:250px;
  position:relative;
  top:32%;
}
#button-explore {
  margin-top: 5%;
  gap:20px;
}
  /************************************ RESPONSIVE  ******************************************/
  
  @media (max-width: 512px) { 
    .webflow-style-input {
      
      width: 100%;
      max-width: 100% !important;
      margin: 0 auto;
      border-radius: 2px;
      padding: 1.1rem 1.5rem 1.2rem;
    }
    .webflow-style-input input {
      
      font-size: 1.2rem !important;
      line-height: 1.5rem;
      vertical-align: middle;
      /* &::-webkit-input-placeholder {
        color: $input-text-inactive;
      } */
    }
    .iframe-360 {
      height:60vh;
     }
     .row-content {
      margin: 1em !important;
     
  }
  .col-about-footer {
    padding-right:0.1em;
  }
  .col-socmed img {
    max-width:30px;
    margin-right: 7px;
}
.card-title {
  font-size: 0.6em;
  min-height: 2.2em;
  font-weight: 700;

}
.col-socmed h4 {
    margin:40px 0px 20px;
    color: #fff;
    font-size: 1em;
}
     .divhomebusinesstext{
      margin-top:3px;
       font-size: 0.7em;
       line-height: 1.1em;
       margin-bottom: 2px;
     }
    .divhomebusinesstextcategory{
     font-size: .5em;
     line-height: .9em;
     margin-bottom: 2px;
     
      }
      .homecitybusiness {
  font-size:0.45em;
      }
      .heading {
        
        margin-top: 56px;
       
        }
      .colcard {
          margin:2em;
      }
      .colcard-2-col-mobile {
        margin-right:0.1em;
        margin-left:0.1em;
        margin-bottom:40px;
      }
      .col-column-2 {
        padding:0.5em;
      }
      .card-text {
        font-size: 0.6em;
      }
      .title-2-column {
        font-size:0.8em;
      }
      .colhero {
        height:280px !important;
      }
      .ads-home {
        margin-top:50px;
        margin-bottom:70px;
        margin-right:25px;
        margin-left:25px;
      }
      .col-hero-inside-wrapper{
        padding:0.3em;
      }
      .suported-by {
       background:#111;
       bottom:-25%;
        left: 100%;
        transform: translate(-100% , -0% );
       
        width: 100%;
      
      }
      .overlay-text {
     
      font-size: 0.7em;
      line-height: 15px;
       top:0%;
padding-bottom:8px;

      }
      .img-supporter {
        max-height:60px;
      }
      .img-play {
        max-width: 100px;
        }
        .divimagecover{
            min-height:30vh;
      }
      .businesspremium h1 {
        font-size:1.8em;   
      }
      #button-explore {
        margin-top: 5%;
        gap:4px;
      }
      #button-explore .btn {
        font-size: 0.55rem !important;
      }
      .card-title-province {
        font-size: 0.675em;
        min-height: 2.2em;
        font-weight: 900;
        color: #333;
        text-align: center;
      }
      .col-logo-supporter {
        width:200px;
        height:200px;
        background: rgb(73, 72, 72);
        border-radius:50%;
        text-align:center;
      
      }
      .logosupporter 
      {
        max-width:180px;
        top:27%;
      }
      .cardsupporter {
       
        padding:20px 10px;
        min-height:116px;
      }
   }

   @media(min-width:1200px) {
    .colhero {
        min-height:880px;
      }
   }
   @media(min-width:1920px) {
    .colhero {
        max-height:750px;
      }
   }

   @media (max-width: 320px) { 
     .navbar-brand img {
      max-width:80px;
     }
     #btn-search-mobile  {
      margin-left:0px;
     }
     .nav-item .nav-link {
      font-size: 0.7em;
     }
     .navbar-nav {
      margin-top: 20px;
      padding: 20px;
     }
     .navbar-collapse.show {
     
      width: 85%;
      }

   }
   
  